<script setup lang="ts">
//组件中引入useSum.ts中的方法
import useSum from "@/hooks/useSum"
import useDog from "@/hooks/useDog"

let {sum, add, sub} = useSum()
// console.log("sum:",sum.value)
let {dogList, getDog} = useDog()
console.log("dogList:", dogList)
</script>

<template>
  <!--  使用hook计算的数据-->
  <div>sum的值为：{{ sum }}</div>
  <button @click="add(1,2)">+</button>
  <button @click="sub(1,2)">-</button>
  <img v-for="(imgUrl,index) in dogList" :key="index" :src="imgUrl">
  <button @click="getDog()">再来一只狗</button>
</template>

<style scoped>
img {
  width: 100px;
  height: 200px;
}
</style>
